<template>    
  <a-layout-header class="header" >
    <div class="logo">
      <img src="../../assets/images/logo.jpg">
    </div>
    <div class="out">
      <span style="margin-right:10px; color: #fff;">admin</span>
      <a-button ghost shape="round" :size="size" @click="quit">
        <template #icon >
          退出
        </template>
      </a-button>
    </div>
  </a-layout-header>
</template>

<script setup>
import { useRouter } from "vue-router";
const router = useRouter()
const quit = () => {
  router.push('/login')
}
</script>
<style lang="less" scoped>
.header{
  background: #002140;
  padding:0 20px ;
  display: flex;
  justify-content: space-between;
  width: 98%;
  margin-left: 12px;
  border-radius: 18px;
  box-sizing: border-box;
  .logo{
    img{
      margin-top: -6px;
      width: 40px;
      height: 40px;
      border-radius: 8px;
    }
  }
}
  
</style>